<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <body>
        <ui:composition template="/WEB-INF/templates/default_template.xhtml">
            <ui:define name="contenido">
                <h:panelGrid cellspacing="15" width="100%">
                    <h:panelGrid columns="2">
                        <p:graphicImage value="/resources/img/icono-programa2.png" />
                        <h:outputText value="#{episodioBean.programa.nomPrograma}" styleClass="titulo" />
                    </h:panelGrid>
                    <p:panel>
                        <h:form id="formEpisodios">
                            <h:panelGrid cellspacing="5" width="100%">
                                <h:outputText value="Episodios" styleClass="subtitulo" />
                                <p:commandButton value="Nuevo Episodio" action="#{episodioBean.nuevo()}" update=":formEpisodio" oncomplete="registrar.show();" icon="icono-agregar" />
                                <p:dataTable id="dataTable" value="#{episodioBean.episodios}" var="episodio" paginator="true" rows="10" rowsPerPageTemplate="10,20,50" paginatorPosition="bottom" emptyMessage="No hay datos para mostrar" rowStyleClass="encima">
                                    <p:column headerText="Numero" width="50">
                                        <h:outputText value="#{episodio.numEpisodio}" />
                                    </p:column>
                                    <p:column headerText="Nombre">
                                        <h:outputText value="#{episodio.nomEpisodio}" />
                                    </p:column>
                                    <p:column width="90">
                                        <p:commandButton title="Ver Episodio" ajax="false" action="pretty:perfil-episodio" icon="icono-perfil">
                                            <f:setPropertyActionListener target="#{perfilEpisodioBean.codigo}" value="#{episodio.codEpisodio}" />
                                        </p:commandButton>
                                        <p:commandButton title="Editar" update=":formEpisodio" oncomplete="registrar.show();" icon="icono-editar">
                                            <f:setPropertyActionListener target="#{episodioBean.episodio}" value="#{episodio}" />
                                        </p:commandButton>
                                        <p:commandButton title="Eliminar" update=":formEpisodio" icon="icono-eliminar" action="#{episodioBean.eliminar(episodio)}">
                                            <p:confirm header="ELIMINAR EPISODIO" message="Va a eliminar el registro. ¿Desea continuar?" icon="icono-eliminar" />
                                        </p:commandButton>
                                    </p:column>
                                </p:dataTable>
                            </h:panelGrid>
                        </h:form>
                        <h:form id="formEpisodio">
                            <p:dialog widgetVar="registrar" header="REGISTRO DE EPISODIO" resizable="false" modal="true">
                                <h:panelGrid>
                                    <h:outputText value="Numero: " styleClass="etiqueta" />
                                    <p:inputText value="#{episodioBean.episodio.numEpisodio}" size="50" />
                                    <h:outputText value="Nombre: " styleClass="etiqueta" />
                                    <p:inputText value="#{episodioBean.episodio.nomEpisodio}" size="50" />
                                    <h:outputText value="Sinópsis: " styleClass="etiqueta" />
                                    <p:inputTextarea value="#{episodioBean.episodio.strSinopsis}" cols="70" rows="15" autoResize="false" />
                                </h:panelGrid>
                                <p:separator />
                                <h:panelGrid columns="2">
                                    <p:commandButton value="GUARDAR" action="#{episodioBean.registrar()}" update=":formEpisodios:dataTable :mensaje" icon="icono-guardar" />
                                    <p:commandButton value="Cancelar" type="button" onclick="registrar.hide();" icon="icono-salir" />
                                </h:panelGrid>
                            </p:dialog>
                        </h:form>
                    </p:panel>
                </h:panelGrid>
            </ui:define>
        </ui:composition>
    </body>
</html>
